@extends('layout')
@section('css')
<link rel="stylesheet" href="{{URL::asset('css/couplet.css')}}">
@endsection
@section('content')
<header class="top">
    <img src="{{URL::asset('img/banner.png')}}" width="100%" style="height:1.5rem">
    <img src="{{URL::asset('img/myPrize.png')}}" class="myPrize">
</header>
<div>
    @for($i=0;$i<5;$i++)
    <div class="@if($i!=0)myhide @endif {{$i}}">
        <div class="coupletBox  notchai">
            <img src="{{URL::asset('img/not.png')}}" class="openButton" alt="">
            <img src="{{URL::asset('img/can.png')}}" data-num1="{{$data[$i]['id']}}" data-num2="{{$data[$i+5]['id']}}" class="openButton openRed myhide" alt="">
            <div class="clearfix">  
                <div class="couplet pull-left notLight" data-id="{{$data[$i]['id']}}">
                    <div class="coupletNum" data-id="{{$data[$i]['id']}}">
                        0
                    </div>
                    <span class="text">点击下方点亮还没这张春联</span>
                    <img src="" alt="" class="coupletImg myhide">
                </div>
                @if($data[$i]['is_use']==1&&$data[$i+5]['is_use']==1)
                    <div>
                        商家页面
                    </div>
                @endif
                <div class="couplet pull-right notLight" data-id="{{$data[$i+5]['id']}}">
                    <div class="coupletNum" data-id="{{$data[$i+5]['id']}}">
                        0
                    </div>
                    <span class="text">点击下方点亮还没这张春联</span>
                    <img src="" alt="" class="coupletImg myhide">
                </div>
            </div>
            <div class="coupletBottom pull-left give myhide" data-id="{{$data[$i]['id']}}">送给朋友</div>
            <div class="coupletBottom pull-left given" data-id="{{$data[$i]['id']}}">请朋友点亮</div>
        
            <div class="coupletBottom pull-right give myhide" data-id="{{$data[$i+5]['id']}}">送给朋友</div>
            <div class="coupletBottom pull-right given" data-id="{{$data[$i+5]['id']}}">请朋友点亮</div>
        </div>
        <div class="coupletBox havechai myhide">
            <div class="clearfix">
                <div class="cross">
                    <img src="" alt="" class="crossImg">
                </div>
                <div class="couplet pull-left notLight" data-id="{{$data[$i]['id']}}">
                    <span class="text"></span>
                    <img src="" alt="" class="coupletImg myhide">
                </div>
                <div></div>
                <div class="couplet pull-right notLight" data-id="{{$data[$i+5]['id']}}">
                    <span class="text"></span>
                    <img src="" alt="" class="coupletImg myhide">
                </div>
            </div>
        </div>
    </div>
    @endfor
    @if($finish['status']==0)
    <div class="bigPicket coupletBox myhide">
        @if($finish['num']==1)
        <img src="{{URL::asset('img/can.png')}}" class="openButton openBigRed" alt="">
        @else
        <img src="{{URL::asset('img/not.png')}}" alt="" class="openButton">
        @endif
        <div class="gif"></div>
        <div class="dot"></div>
        <div class="progress">
            <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: {{$finish['num']*100}}%;"></div>
        </div>
        <img src="{{URL::asset('img/bidPicketIcon.png')}}" class="icon" alt="">
        @if($finish['num']==1)
        <div class="describe jiqi first">恭喜集齐春联</div>
        <div class="describe jiqi">立即拆开大红包</div>
        @else
        <div class="describe">已完成<span>{{$finish['amount']}}</span>副春联，还差{{5-$finish['amount']}}副</div>
        @endif
    </div>
    @else
    <div class="bigPicket coupletBox myhide yichai">
        <h1 class="zhufu">祝福语</h1>
        <div></div>
    </div>
    @endif
</div>
<div class="coupletListBox">
    <div class="coupletList row">
        <div class="col-xs-2 bigRedButton">
            <div class="bigRed">迎</div>
            <div class="coupletName">888红包</div>
        </div>
        <div class="col-xs-2 active">
            <div data-num="0" class="coupletType">新</div>
            <div class="coupletName">未兑换</div>
        </div>
        <div class="col-xs-2">
            <div data-num="1" class="coupletType">春</div>
            <div class="coupletName">未兑换</div>
        </div>
        <div class="col-xs-2">
            <div data-num="2" class="coupletType">过</div>
            <div class="coupletName">未兑换</div>
        </div>
        <div class="col-xs-2">
            <div data-num="3" class="coupletType">肥</div>
            <div class="coupletName">未兑换</div>
        </div>
        <div class="col-xs-2">
            <div data-num="4" class="coupletType">年</div>
            <div class="coupletName">未兑换</div>
        </div>
    </div>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="type1">
  <div class="modal-dialog" role="document">
    <div class="background">
        <div class="cross">过个肥年</div>
        <div class="gif"></div>
        <div class="company">XXX公司给你发了一个红包</div>
        <div class="amount"><span class="jine"></span><small>元</small></div>
        <div class="lipin hide"></div>
    </div>
  </div>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="type2">
  <div class="modal-dialog" role="document">
    <div class="background">
        <div class="cross">活动祝福语</div>
        <div class="gif"></div>
        <div class="company">XXX公司给你发了一个红包</div>
        <div class="amount"><span class="jine"></span><small>元</small></div>
    </div>
  </div>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="prompt">
    <div class="modal-dialog" role="document">
        <div class="background">
            <div class="title">温馨提示</div>
            <div class="text"></div>
            <div>
                <div class="sure" data-dismiss="modal">好的!</div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" tabindex="-1" role="dialog" id="giveModal">
    <div class="modal-dialog" role="document">
        <div class="background">
            <div class="title">温馨提示</div>
            <div class="text">您确定要把这个对联分享出去吗？</div>
            <div class="buttonBox">
                <div class="cancel" data-dismiss="modal">取消</div>
                <div class="sure" data-id=''>好的!</div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('script')
<script>
    //window.location.href="https://hxsapp_visible_act_share_btn#分享标题#分享链接#封面地址#分享描述#活动分享统计类型名称";
    var u_id = '{{$u_id}}';
    var is_share = '{{$share}}';
    var domain = window.location.host;
    function is_weixin() { 
        var ua = window.navigator.userAgent.toLowerCase(); 
        if (ua.match(/MicroMessenger/i) == 'micromessenger') { 
            console.log("微信浏览器"); 
            return true;
            
        } else { 
            console.log("不是微信浏览器"); 
            return false;
        } 
    }
    $('.coupletType').on('click',function(){
        var num = $(this).data('num');
        var couplet1,couplet2,cross;
        $('.'+num).show().siblings().hide();
        $(this).parent('.col-xs-2').addClass('active').siblings().removeClass('active');
    });
    $('.bigRedButton').on('click',function(){
        $('.bigPicket').show().siblings().hide();
        $(this).siblings().removeClass('active');
    });
    $('.myPrize').on('click',function(){
        $wx = is_weixin();
        if($wx==true){
            $('#prompt').modal('show');
            $('#prompt .text').text('请下载app进行提现操作');
        }else{
            location.href = '/myPrize?u_id='+u_id;
        }
    });
    $(document).ready(function(){
        if(is_share==true){
            $('#prompt').modal('show');
            $('#prompt .text').text('您获得一张好友赠送的春联，马上查看');
        }
        getCoupletDetail(u_id,1,6,'1','0');
        getCoupletDetail(u_id,2,7,'2','1');
        getCoupletDetail(u_id,3,8,'3','2');
        getCoupletDetail(u_id,4,9,'4','3');
        getCoupletDetail(u_id,5,10,'5','4');
        $.ajax({
            url:'/getUsedCouplet',
            dataType:'JSON',
            type:'get',
            data:{'user':u_id},
            success:function(data){
                data.data.forEach(function(item){
                    if(item.id==1||item.id==6){
                        $('.coupletListBox [data-num="0"]').addClass('opened').siblings('.coupletName').text('已兑换');
                    }else if(item.id==2||item.id==7){
                        $('.coupletListBox [data-num="1"]').addClass('opened').siblings('.coupletName').text('已兑换');
                    }else if(item.id==3||item.id==8){
                        $('.coupletListBox [data-num="2"]').addClass('opened').siblings('.coupletName').text('已兑换');
                    }else if(item.id==4||item.id==9){
                        $('.coupletListBox [data-num="3"]').addClass('opened').siblings('.coupletName').text('已兑换');
                    }else if(item.id==5||item.id==10){
                        $('.coupletListBox [data-num="4"]').addClass('opened').siblings('.coupletName').text('已兑换');
                    }
                });
            }
        });
    });
    function getCoupletDetail(u_id,couplet1,couplet2,cross,num){
        $.ajax({
            url:'/getUserCoupletByid',
            dataType:'JSON',
            type:'get',
            data:{'u_id':u_id,'couplet1':couplet1,'couplet2':couplet2},
            success:function(data){
                var amount1=0,
                    amount2=0;
                data.data.forEach(function(item){
                    if(item.id==couplet1){
                        if(item.is_use==0){
                            amount1++;
                            $(".coupletBottom.give[data-id='"+item.id+"']").show();
                            $(".coupletBottom.given[data-id='"+item.id+"']").hide();
                            data.data.forEach(function(value){
                                if(value.id==couplet2){
                                    if(value.is_use==0){
                                        $('.'+num+' .openRed').show().siblings('.openButton').hide();
                                    }
                                }
                            });
                        }else{
                            $(".coupletBottom.give[data-id='"+item.id+"']").hide();
                            $(".coupletBottom.given[data-id='"+item.id+"']").hide();
                        }
                        $(".coupletNum[data-id='"+item.id+"']").text(amount1);
                    }else if(item.id==couplet2){
                        if(item.is_use==0){
                            amount2++;
                            $(".coupletBottom.give[data-id='"+item.id+"']").show();
                            $(".coupletBottom.given[data-id='"+item.id+"']").hide();
                        }else{
                            $(".coupletBottom.give[data-id='"+item.id+"']").hide();
                            $(".coupletBottom.given[data-id='"+item.id+"']").hide();
                        }
                        $(".coupletNum[data-id='"+item.id+"']").text(amount2);
                    }
                    if(item.is_use==1){
                        $('.'+num+' .crossImg').attr('src',"http://"+domain+"/img/cross"+cross+".png");
                        $('.'+num+' .havechai').show().siblings('.notchai').hide();
                    }
                    $(".couplet[data-id='"+item.id+"']").addClass('light').removeClass('notLight');
                    $(".couplet[data-id='"+item.id+"'] .text").addClass('myhide');
                    $(".couplet[data-id='"+item.id+"'] .coupletImg").removeClass('myhide');
                    $(".couplet[data-id='"+item.id+"'] .coupletImg").attr('src',"http://"+domain+"/img/couplet"+item.id+".png");
                });
            }
        });
    }
    $('.openRed').on('click',function(){
        var couplet_id1 = $(this).data('num1');
        var couplet_id2 = $(this).data('num2');
        $.ajax({
            url:'/openRed',
            dataType:'JSON',
            type:'post',
            data:{'user':u_id,'couplet_id1':couplet_id1,'couplet_id2':couplet_id2},
            success:function(data){
                if(data.code==200){
                    if(couplet_id1==1){
                        $('#type1 .cross').text('过个肥年');
                         getCoupletDetail(u_id,1,6,'1','0');
                    }else if(couplet_id1==2){
                        $('#type1 .cross').text('年年有余');
                        getCoupletDetail(u_id,2,7,'2','1');
                    }else if(couplet_id1==3){
                        $('#type1 .cross').text('吉星高照');
                        getCoupletDetail(u_id,3,8,'3','2');
                    }else if(couplet_id1==4){
                        $('#type1 .cross').text('恭贺新春');
                        getCoupletDetail(u_id,4,9,'4','3');
                    }else if(couplet_id1==5){
                        $('#type1 .cross').text('新春大吉');
                        getCoupletDetail(u_id,5,10,'5','4');
                    }
                    if(data.data.prize_type==0){
                        $('#type1').modal('show');
                        $('#type1 .amount .jine').text(data.data.amount);
                    }else{
                        $('lipin').show().siblings('.amount').hide();
                        $('#type1 .lipin').text(data.data.prize_name);
                    }
                }else{
                    $('#prompt').modal('show');
                    $('#prompt .text').text(data.msg);
                }
            }
        });
        
    });
    $('.give').on('click',function(){
        $wx = is_weixin();
        if($wx==true){
            $('#prompt').modal('show');
            $('#prompt .text').text('请下载app进行提现操作');
        }else{
            $('#giveModal').modal('show');
            var couplet_id = $(this).data('id');
            $('#giveModal .sure').attr('data-id',couplet_id);
        }
    });
    $('#giveModal .sure').on('click',function(){
        $wx = is_weixin();
        if($wx==true){
            $('#prompt').modal('show');
            $('#prompt .text').text('请下载app进行提现操作');
        }else{
            var couplet_id = $(this).data('id');
            $.ajax({
                url:'/userShareCouplet',
                dataType:'JSON',
                type:'post',
                data:{'giveUser':u_id,'couplet_id':couplet_id},
                success:function(data){
                    if(data.code==200){
                        if(couplet_id==1||couplet_id==6){
                            $('#type1 .cross').text('该减肥了');
                                getCoupletDetail(u_id,1,6,'1','0');
                        }else if(couplet_id==2||couplet_id==7){
                            $('#type1 .cross').text('年年有余');
                            getCoupletDetail(u_id,2,7,'2','1');
                        }else if(couplet_id==3||couplet_id==8){
                            $('#type1 .cross').text('吉星高照');
                            getCoupletDetail(u_id,3,8,'3','2');
                        }else if(couplet_id==4||couplet_id==9){
                            $('#type1 .cross').text('恭贺新春');
                            getCoupletDetail(u_id,4,9,'4','3');
                        }else if(couplet_id==5||couplet_id==10){
                            $('#type1 .cross').text('新春大吉');
                            getCoupletDetail(u_id,5,10,'5','4');
                        }
                        location.href = 'https://hxsapp_tune_up_share#送春联#http://hxsh5.fsgit.cn'+'/accept?share_id='+data.id+'#封面地址#送春联'
                    }else{
                        $('#prompt').modal('show');
                        $('#prompt .text').text(data.msg);
                    }
                }
            });
        }
    });
    $('.given').on('click',function(){
        $wx = is_weixin();
        if($wx==true){
            $('#prompt').modal('show');
            $('#prompt .text').text('请下载app进行提现操作');
        }else{
            var couplet_id = $(this).data('id');
            $.ajax({
                url:'/strat_help',
                dataType:'JSON',
                type:'post',
                data:{'u_id':u_id,'couplet_id':couplet_id},
                success:function(data){
                    if(data.code ==200){
                        location.href = 'https://hxsapp_tune_up_share#请求点亮#http://hxsh5.fsgit.cn'+'/wx?help_id='+data.data+'#封面地址#请求点亮'
                    }else{
                        $('#prompt').modal('show');
                        $('#prompt .text').text(data.msg);
                    }
                }
            });
        }
    });
    $('.openBigRed').on('click',function(){
        $wx = is_weixin();
        if($wx==true){
            $('#prompt').modal('show');
            $('#prompt .text').text('请下载app进行提现操作');
        }else{
            $.ajax({
                url:'/openBidRed',
                dataType:'JSON',
                type:'post',
                data:{'u_id':u_id},
                success:function(data){
                    if(data.code==200){
                        $('#type2').modal('show');
                        $('#type2 .amount .jine').text(data.data.amount);
                        getCoupletDetail(u_id,1,6,'1','0');
                        getCoupletDetail(u_id,2,7,'2','1');
                        getCoupletDetail(u_id,3,8,'3','2');
                        getCoupletDetail(u_id,4,9,'4','3');
                        getCoupletDetail(u_id,5,10,'5','4');
                    }else{
                        $('#prompt').modal('show');
                        $('#prompt .text').text(data.msg);
                    }
                }

            });
        }
    });
</script>
@endsection 